<template>
    <a-input v-model:value="ItemVlaue"></a-input>
</template>
<script setup>
// 组件1，由于组件完全与数据隔离，不调用任何接口
import { ref, watch } from 'vue';

const ItemVlaue = ref('');
const emit = defineEmits(['update:value']);

// 组件中的数据由数据传递供应
const props = defineProps({
    value: String,
});

// 数据监听，外层数据变化，更新内部数据
watch(() => props.value, (val) => {
    ItemVlaue.value = val;
}, { immediate: true })

// 数据反馈，内层数据更新，通知外层进行更新
watch(() => ItemVlaue.value, (val) => {
    console.log(val);
    emit('update:value', val);
})

</script>
<style lang="less" scoped>
</style>